<template>
  <div class="step-three">
    <Header :active-step="currentStep" />
    <h3>入驻复审</h3>
    <p>请等待审核人员复审您的信息，复审结果将在3个工作日内通过手机和邮箱通知您。</p>
    <el-form :model="form" label-width="160px" style="width: 590px; margin: 20px auto;">
      <el-form-item label="补充说明">
        <el-input v-model="form.remark" type="textarea" placeholder="如有需要，可在此补充说明" />
      </el-form-item>
    </el-form>
    <div class="step-buttons">
      <el-button @click="$emit('prev')">上一步</el-button>
      <el-button type="danger" @click="submit">提交复审</el-button>
    </div>
  </div>
</template>

<script>
import { submitReview } from '@/api/auth/auth';
import Header from "@/views/auth/Header.vue";

export default {
  name: 'StepThree',
  components: {
    Header // 正确注册组件
  },
  data() {
    return {
      form: { remark: '' }
    };
  },
  methods: {
    async submit() {
      try {
        await submitReview(this.form);
        this.$message.success('已提交复审');
        this.$emit('next', 3);
      } catch (error) {
        this.$message.error('提交失败');
      }
    }
  }
};
</script>

<style scoped>
.step-three {
  padding: 20px;
}
.step-buttons {
  margin-top: 20px;
}
.step-buttons .el-button {
  margin: 0 10px;
}
</style>
